<%--
  Created by IntelliJ IDEA.
  User: 18360
  Date: 2018-11-08
  Time: 00:44
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<html>
<head>
    <title>Title</title>
    <jsp:include page="/commen/commen.jsp" />
    <%--<link href="${pageContext.request.contextPath}/static/hplus/css/bootstrap.min.css" rel="stylesheet">--%>
    <%--<link href="${pageContext.request.contextPath}/static/hplus/css/plugins/bootstrap-table/bootstrap-table.min.css" rel="stylesheet">--%>

    <%--<script src="${pageContext.request.contextPath}/static/hplus/js/jquery.min.js"></script>--%>
    <%--<script src="${pageContext.request.contextPath}/static/hplus/js/bootstrap.min.js"></script>--%>
    <%--<script src="${pageContext.request.contextPath}/static/hplus/js/plugins/bootstrap-table/bootstrap-table.min.js"></script>--%>
    <%--<script src="${pageContext.request.contextPath}/static/hplus/js/plugins/bootstrap-table/locale/bootstrap-table-zh-CN.min.js"></script>--%>




    <script type="text/javascript">

        //得到查询的参数
        function queryParams (params) {
        };

        /**
         * 类别增
         */
        $(function () {
            $.post("${pageContext.request.contextPath}/shangPin/select",function (data) {
                var _this = $("#fen1 select[name=xid]");
                $(_this).empty();
                for (var i=0 ;i < data.length;i++) {
                    $(_this).append("<option value="+data[i].xid+">"+data[i].xname+"</option>");
                }
            });
        });
        /**
         * 单位增
         */
        $(function () {
            $.post("${pageContext.request.contextPath}/shangPin/selectdw",function (data) {
                var _this = $("#dan1 select[name=dwid]");
                $(_this).empty();
                for (var i=0 ;i < data.length;i++) {
                    $(_this).append("<option value="+data[i].dwid+">"+data[i].dwname+"</option>");
                }
            });
        });

        /**
         * 类别改
         */
        $(function () {
            $.post("${pageContext.request.contextPath}/shangPin/select",function (data) {
                var _this = $("#fen2 select[name=xid]");
                $(_this).empty();
                for (var i=0 ;i < data.length;i++) {
                    $(_this).append("<option value="+data[i].xid+">"+data[i].xname+"</option>");
                }
            });
        });
        /**
         * 单位改
         */
        $(function () {
            $.post("${pageContext.request.contextPath}/shangPin/selectdw",function (data) {
                var _this = $("#dan2 select[name=dwid]");
                $(_this).empty();
                for (var i=0 ;i < data.length;i++) {
                    $(_this).append("<option value="+data[i].dwid+">"+data[i].dwname+"</option>");
                }
            });
        });



        var sid = 0;

        function del(id) {
            sid =id;
            $("#del").modal("show")
        }

        function dodel() {
            $.post("${pageContext.request.contextPath}/shangPin/delete",{"sid":sid},
                function(data){
                    // alert("data="+data);
                    //把字符串转换成json
                    /*  var mydata = eval("("+data+")") ;
                      $("#shangpin").bootstrapTable('load',mydata) ;*/
                    //关闭对话框
                    searcha();
                    $("#del").modal('hide');
                    <%--$.post("${pageContext.request.contextPath}/shangPin/queryPage",function(data){--%>
                        <%--// $("#shangpin").bootstrapTable('load',data);--%>
                        <%--if(data==1){--%>
                            <%--// searcha();--%>
                            <%----%>
                            <%--$("#shangpin").bootstrapTable('load',data);--%>
                            <%----%>
                        <%--}--%>

                    <%--});--%>

                });
        }

        function searcha() {
            var opts = $("#shangpin").bootstrapTable("getOptions") ;
            var limit = opts.pageSize ;
            var offset = (opts.pageNumber-1) * limit;
            var sname = $("#sname").val() ;
            $.post("${pageContext.request.contextPath}/shangPin/queryPage",{'sname':sname,'limit':limit,'offset':offset},function (data) {
                // var mydata = eval("("+data+")") ;
                //重新绑定表格数据
                $("#shangpin").bootstrapTable('load',data) ;
            })
        }


        function zeng() {
            document.getElementById("fm").reset();
            $("#mota").modal("show")
        }

        function add(){
            //商品名称
            var snameA = $("[name = snameA]").val();
            //商品数量
            var scountA= $("[name=scountA]").val();
            //分类
            var xidA = $("[name=xid]").val();
            //成本价
            var chengbenA = $("[name=chengbenA]").val();
            //单价
            var danjiaA = $("[name=danjiaA]").val();
            //单位
            var dwidA = $("[name=dwid]").val();

            /*    alert(snameA+"=="+scountA+"=="+xidA+"=="+chengbenA+"=="+danjiaA+"=="+dwidA)*/

            $.post("${pageContext.request.contextPath}/shangPin/add",{sname:snameA,scount:scountA,xid:xidA,chengben:chengbenA,danjia:danjiaA,dwid:dwidA},function(data){
                    if(data==1){
                        searcha();
                        $("#mota").modal('hide');
                    }
                }
            )
        }


        var sid = 0;
        //show更改 模态框i
        function gai(id) {
            sid =id;
            $("#update").modal("show");
           $.post('${pageContext.request.contextPath}/shangPin/getsid2',{'sid':sid},function(data){

               $("#update").on('shown.bs.modal',function(e){
                   $("[name=sname]").val(data.sname);
                   $("[name=scount]").val(data.scount);
                   $("[name=xid]").val(data.xid);
                   $("[name=chengben]").val(data.chengben);
                   $("[name=danjia]").val(data.danjia);
                   $("[name=dwid]").val(data.dwid);

               })
           })

        }

        function update(){
            //商品名称
            var snameA = $("[name=sname]").val();
            //商品数量
            var scountA= $("[name=scount]").val();
            //分类
            var xidA = $("#fen2 [name=xid]").val();
            //成本价
            var chengbenA = $("[name=chengben]").val();
            //单价
            var danjiaA = $("[name=danjia]").val();
            //单位
            var dwidA = $("#dan2 [name=dwid]").val();

             //alert(snameA+"=="+scountA+"=="+xidA+"=="+chengbenA+"=="+danjiaA+"=="+dwidA)

            $.post("${pageContext.request.contextPath}/shangPin/update",{"sname":snameA,"scount":scountA,"xid":xidA,"chengben":chengbenA,"danjia":danjiaA,"dwid":dwidA,"sid":sid},function(data){

                if(data ==1){
                    searcha();
                    $("#update").modal('hide');
                }
                }
            )
        }






        /**
         * 表格
         */
        $(function () {
            //数据校验
            $('#fm').bootstrapValidator({
                message: '',
                feedbackIcons: {
                    valid: 'glyphicon glyphicon-ok',
                    invalid: 'glyphicon glyphicon-remove',
                    validating: 'glyphicon glyphicon-refresh'
                },
                fields: {
                    snameA: {
                        message: '商品名称不能为空！',
                        validators: {
                            notEmpty: {
                                message: '商品名称不能为空！'
                            }
                        }
                    },
                    chengbenA: {
                        message: '成本价不能为空！',
                        validators: {
                            notEmpty: {
                                message: '成本价不能为空！'
                            }
                        }
                    },
                    danjiaA: {
                        message: '单价不能为空！',
                        validators: {
                            notEmpty: {
                                message: '单价不能为空！'
                            }
                        }
                    }
                }
            });


            $('#shangpin').bootstrapTable({
                url:'${pageContext.request.contextPath}/shangPin/queryPage',
                pagination:true,
                sidePagination:'server',
                pageList:[5,10,15],
                height:500,

                //请求服务器数据时，你可以通过重写参数的方式添加一些额外的参数，例如 toolbar 中的参数 如果 queryParamsType = 'limit' ,返回参数必须包含
                //limit, offset, search, sort, order 否则, 需要包含:
                //pageSize, pageNumber, searchText, sortName, sortOrder.
                // 返回false将会终止请求。
                queryParams:function(params){
                    var temp = {  //这里的键的名字和控制器的变量名必须一直，这边改动，控制器也需要改成一样的
                        limit: params.limit,  //页面大小
                        offset: params.offset, //页码
                        sname:$("#sname").val()
                    };
                    return temp;
                },
                columns: [{
                    field: 'sid',
                    title: '商品编号',
                    align:'center'
                }, {
                    field: 'sname',
                    title: '商品名称',
                    align:'center'
                }, {
                    field: 'scount',
                    title: '库存数量',
                    align:'center'
                },{
                    field: 'xiaoclass.xname',
                    title: '所属分类',
                    align:'center'
                },{
                    field: 'chengben',
                    title: '成本价',
                    align:'center'
                }, {
                    field: 'danjia',
                    title: '单价',
                    align:'center'
                },{
                    field: 'danwei.dwname',
                    title: '单位',
                    align:'center'
                }, {
                    title: '操作',
                    align:'center',
                    formatter(value, row, index, field) {
                        return "<button onclick=del("+row.sid+") type=\"button\" class=\"btn btn-danger\">删除</button>&nbsp;&nbsp;"
                            +"<button onclick=gai("+row.sid+") type=\"button\" class=\"btn btn-primary\">更改</button>\n";
                    }
                }]
            });

        })



    </script>


</head>
<body>

<div class="panel panel-default">
    <div class="panel-heading">
        <h3 class="panel-title">商品信息</h3>
    </div>
    <div class="panel-body">
        <div class="row" style="margin-bottom: 10px">
            <form action="" class="form-inline">
                <div class="col-sm-4">
                    <!-- Large modal -->
                    <button  onclick="zeng()" type="button" class="btn btn-primary" data-toggle="modal" data-target=".bs-example-modal-lg">商品添加</button>
                </div>
                <div class="col-sm-4 col-sm-offset-4 text-right">
                    <input id="sname" type="text" class="form-control">
                    <input onclick="searcha()" type="button" class="btn btn-primary" value="查询">
                </div>
            </form>
            <table id="shangpin"></table>
        </div>
    </div>
</div>
<%--删除提示--%>
<div id="del" class="modal fade bs-example-modal-sm">
    <div class="modal-dialog modal-sm">
        <div class="modal-content">
            <div class="modal-header">
                <h4 class="modal-title">提示</h4>
            </div>
            <div class="modal-body">
                <p>确定要删除吗?</p>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
                <button onclick="dodel()" type="button" class="btn btn-primary">删除</button>
            </div>
        </div>
    </div>
</div>

<%--增加--%>
<div id="mota" class="modal fade" tabindex="-1" role="dialog">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                <h4 class="modal-title">增加</h4>
            </div>
            <div class="modal-body">

                        <div class="ibox-content">
                            <form method="get" class="form-horizontal" id="fm">


                                <div class="hr-line-dashed"></div>
                                <div class="form-group">
                                    <label class="col-sm-2 control-label">商品名:</label>

                                    <div class="col-sm-10">
                                        <input type="text" name ="snameA" placeholder="商品名称" class="form-control">                             </div>

                                    </div>


                                        <input type="hidden" value="0" name="scountA" placeholder="商品数量" class="form-control">

                                <div class="form-group draggable ui-draggable">
                                    <label class="col-sm-2 control-label">分类:</label>
                                    <div id="fen1" class="col-sm-9">
                                        <select class="form-control" name="xid">
                                            <option value="0">请选择：</option>
                                        </select>
                                    </div>
                                </div>

                                <div class="form-group draggable ui-draggable">
                                    <label class="col-sm-2 control-label">单位:</label>
                                    <div id="dan1" class="col-sm-9">
                                        <select class="form-control" name="dwid">



                                        </select>
                                    </div>
                                </div>


                                <div class="hr-line-dashed"></div>
                                <div class="form-group">
                                    <label class="col-sm-2 control-label">成本价:</label>

                                    <div class="col-sm-3">
                                        <input type="text" name="chengbenA" placeholder="￥0.00" class="form-control">
                                    </div>
                                    <label class="col-sm-3 control-label">单价:</label>

                                    <div class="col-sm-3">
                                        <input type="text" name="danjiaA" placeholder="￥0.00" class="form-control">
                                    </div>
                                </div>

                                <div class="modal-footer">
                                    <button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
                                    <button type="button" class="btn btn-primary" onclick="add()">增加</button>
                                </div>

                            </form>
                        </div>

            </div>

        </div><!-- /.modal-content -->
    </div><!-- /.modal-dialog -->
</div><!-- /.modal -->


<%--更改--%>
<div id="update" class="modal fade" tabindex="-1" role="dialog">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                <h4 class="modal-title">更改</h4>
            </div>
            <div class="modal-body">

                <div class="ibox-content">
                    <form method="get" class="form-horizontal">


                        <div class="hr-line-dashed"></div>
                        <div class="form-group">
                            <label class="col-sm-2 control-label">商品名:</label>

                            <div class="col-sm-9">
                                <input type="text" name="sname" placeholder="商品名称" class="form-control">
                            </div>
                        </div>

                        <div class="hr-line-dashed"></div>
                        <div class="form-group">

                            <div class="col-sm-9">
                                <input type="text"type="hidden"  readOnly="true"  style="display:none" name="scount" placeholder="商品数量" class="form-control">
                            </div>
                        </div>

                        <div class="form-group draggable ui-draggable">
                            <label class="col-sm-2 control-label">分类:</label>
                            <div id="fen2" class="col-sm-9">
                                <select class="form-control" name="xid">

                                </select>
                            </div>
                        </div>

                        <div class="form-group draggable ui-draggable">
                            <label class="col-sm-2 control-label">单位:</label>
                            <div id="dan2" class="col-sm-9">
                                <select class="form-control" name="dwid">



                                </select>
                            </div>
                        </div>


                        <div class="hr-line-dashed"></div>
                        <div class="form-group">
                            <label class="col-sm-2 control-label">成本价:</label>

                            <div class="col-sm-3">
                                <input type="text" name="chengben" placeholder="￥0.00" class="form-control">
                            </div>
                            <label class="col-sm-3 control-label">单价:</label>

                            <div class="col-sm-3">
                                <input type="text" name="danjia" placeholder="￥0.00" class="form-control">
                            </div>
                        </div>
                    </form>
                </div>

            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
                <button type="submit" class="btn btn-primary" onclick="update()">更改</button>
            </div>
        </div><!-- /.modal-content -->
    </div><!-- /.modal-dialog -->
</div><!-- /.modal -->


</body>
</html>
